import { ref } from 'vue';
import { getGlobalViewer } from '@/components/GlobalCesium';
import {
  BoundingSphere,
  defined,
  JulianDate,
  ScreenSpaceEventHandler,
  ScreenSpaceEventType,
} from '@space8/czm-plugin';
import { useStationDataStoreWithOut } from '@/store/modules/stationData';

const photoViewer360ID = ref<any>(null);
const stationDataStore = useStationDataStoreWithOut();

export function useCesiumEvent() {
  const viewer = getGlobalViewer();
  const handler = new ScreenSpaceEventHandler(viewer.canvas);
  handler.setInputAction((click) => {
    const pickedObject = viewer.scene.pick(click.position);
    if (defined(pickedObject) && defined(pickedObject.id)) {
      if (defined(pickedObject.id.billboard) && defined(pickedObject.id.type)) {
        if (pickedObject.id.type === 'toInner') {
          window.location.href = '#/pilotZone';
        } else if (pickedObject.id.type === 'reservoir') {
          const position = pickedObject.id.position.getValue(JulianDate.now());
          viewer.camera.flyToBoundingSphere(new BoundingSphere(position, 1000));
        } else if (pickedObject.id.type === 'station') {
          const stcd = pickedObject.id.properties.stcd.getValue();
          const sttp = pickedObject.id.properties.sttp.getValue();
          const stnm = pickedObject.id.properties.stnm.getValue();
          // 调用测站弹窗
          stationDataStore.setStationData({ stcd, sttp, stnm });
        }
      } else if (defined(pickedObject.id.point) && defined(pickedObject.id.type)) {
        if (pickedObject.id.type === 'view360') {
          photoViewer360ID.value = {
            panorama: pickedObject.id.properties.panorama,
            markers: pickedObject.id.properties.markers,
            smallImgUrl: pickedObject.id.properties.smallImgUrl,
          };
        }
      }
    }
  }, ScreenSpaceEventType.LEFT_CLICK);
}

// 获取当前选中的全景图ID
const getPhotoViewer360ID = () => {
  return photoViewer360ID;
};

export { getPhotoViewer360ID };
